<template>
  <!-- 待发货 -->
  <div>
    <div class="title" v-for="(item, index) in DeliveredData" :key="index">
      <van-cell title="商品描述" is-link to="" />
      <div>
        <van-row>
          <van-col span="8">
            <img src="../assets/img/暂无消息.png" alt="" width="100%" />
          </van-col>
          <van-col span="16">
            <h3>{{ item.title }}</h3>
            <div>
              <span>下单时间：</span>
              <span>{{ item.orderTime }}</span>
            </div>
            <div>
              <span>下单人：</span>
              <span>{{ item.orderUserName }}</span>
            </div>
          </van-col>
        </van-row>
        <div class="btn">
          <van-button round type="info" @click="goConfirmDelivery(index)">{{
            status
          }}</van-button>
        </div>
      </div>
    </div>
    <van-pagination
      v-model="currentPage"
      :page-count="100"
      mode="simple"
      @change="changeCurrent"
    />
  </div>
</template>

<script>
import { GetOrderDeliveredData } from "@/request/api";
export default {
  data() {
    return {
      loading: true,
      DeliveredData: [],
      status: "发货",
      currentPage: 1,
    };
  },
  props: ["searchvalue"],
  created() {
    // 发送请求渲染数据
    GetOrderDeliveredData({
      current: this.currentPage,
      size: "20",
      keyword: this.searchvalue,
    }).then((res) => {
      console.log(res);
      this.DeliveredData = res.data.records;
    });
  },
  methods: {
    changeCurrent() {
      GetOrderDeliveredData({
        current: this.currentPage,
        size: "20",
        keyword: this.searchvalue,
      }).then((res) => {
        console.log(res);
        this.DeliveredData = res.data.records;
      });
    },
    // 跳转到确认发货页
    goConfirmDelivery(index) {
      this.$router.push(
        `/order/confirmdelivery?info=${JSON.stringify(this.DeliveredData[index])}`
      );
    },
  },
};
</script>
 
<style lang = "less" scoped>
.title {
  background-color: #fff;
  margin: 10px 0;
  /* padding: 0.5rem; */
  .van-cell {
    border-bottom: 1px solid #ccc;
  }
  .van-cell__title {
    text-align: left;
    font-size: 16px;
  }
}
.van-row {
  padding: 10px;
  border-bottom: solid 1px #ccc;
}
.btn {
  text-align: right;
  padding: 10px;
  .van-button {
    height: 35px;
    width: 80px;
  }
}
</style>